<template>
    <div class="index clearafter">
        <module-head></module-head>
        <div class="content cbafter">
            <div class="w220 fl">
                <menu-list></menu-list>
            </div>
            <div class="w980 fr">
                <div class="h1_tit">
                    <h1>工作日志</h1>
                </div>
               <div class="memberlist mb20">
                    <form class="cbafter" id="search" v-on:submit.prevent="searchmethod">
                        <div class="fl">
                            <label for="">开始日期：</label>
                            <input type="text" class="form-control" placeholder="" v-model = "param.startDate" id="start4">
                            <label for="">结束日期：</label>
                            <input type="text" class="form-control" placeholder="" v-model = "param.endDate" id="end3">
                            <button class="btn btn-primary" style = "margin-left:200px;" type="submit">查 询</button>
                        </div>
                        <div class="fr">
                            <button class="btn btn-primary" type="button" @click = "print">打印</button>
                        </div>
                    </form>
                </div>
                    <div class="menuset_con_right">
                        <div class="modules">
                            <table class="table table-hover table-striped" id="print">
                                <thead>
                                    <tr>
                                        <th>时间</th>
                                        <th>会员总数</th>
                                        <th>vip会员数</th>
                                        <th>今日新增会员数</th>
                                        <th>会员预约就诊人数</th>
                                        <th>会员咨询人数</th>
                                        <th>电话回访数</th>
                                        <th>危机值处理人次</th>
                                        <th>120紧急救援人次</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr v-for="item in logs" track-by="$index">
                                        <td>{{item.date}}</td>
                                        <td>{{item.memberCount}}</td>
                                        <td>{{item.memberCountVip}}</td>
                                        <td>{{item.memberAdd}}</td>
                                        <td>{{item.memberAddVip}}</td>
                                        <td>{{item.doctorRegistrationBookingCount}}</td>
                                        <td>{{item.pictureTextConsultCount}}</td>
                                        <td>{{item.phoneConsultCount}}</td>
                                        <td>{{item.revisitCount}}</td>
                                    </tr>
                                    <!--  <tr>
                                        <td colspan="7">
                                            <div class="form-group" _v-b33c703c="">
                                                <button class="default blue center" _v-b33c703c="">保存</button>
                                            </div>
                                        </td>
                                    </tr> -->
                                </tbody>

                            </table>
                        </div>
                        <div  v-if = "logs==''" style="text-align: center;">
                            暂无数据
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import 'assets/lib/bootstrap-3.3.2/css/bootstrap.min.css'
import 'assets/lib/bootstrap-3.3.2/js/bootstrap.min.js'
import 'assets/lib/laydate/laydate.js'
import 'assets/lib/laydate/need/laydate.css'
import 'assets/lib/laydate/skins/danlan/laydate.css'
import 'assets/reset.css'
import 'assets/jquery.jqprint-0.3.js'
import 'assets/print.js'
import moduleHead from 'components/module-head'
import menuList from 'components/menu-list'
import Public from 'assets/public.js'
import bootPage from 'components/BootPage.vue'
export default {
    data() {
            return {
                // lenArr: [10, 20, 50], // 每页显示长度设置
                // pageLen: 5, // 可显示的分页数
                // headersparam: {
                //     "X-Service-Id": "coms.reportFormService",
                //     "X-Service-Method": "queryWorkReport",
                // },
                param: {
                    startDate:"",
                    endDate:"",
                },
                ishide: false,
                logs:[],
            }
        },
        computed: {

        },
        components: {
            moduleHead, menuList, bootPage
        },
        ready() {
             var that = this;
            var myDate = new Date(); //获取今天日期
            // this.param.endDate = Public.formatDate(myDate);
            this.param.endDate = Public.formatDate(myDate);
            myDate.setDate(myDate.getDate()-myDate.getDate()+1);
            this.param.startDate = Public.formatDate(myDate);
            
            // 日历插件
            laydate({
                elem: '#start4',
                fixed: true,
                max: laydate.now(),
                // min: laydate.now(-30),
                istoday: false,
                choose: function(datas) { //选择日期完毕的回调  
                    that.param.startDate = datas;
                }
            });
            // 日历插件
            laydate({
                elem: '#end3',
                fixed: true,
                max: laydate.now(),
                // min: laydate.now(-30),
                istoday: false,
                choose: function(datas) { //选择日期完毕的回调  
                    that.param.endDate = datas
                }
            });
            var stime = this.param.startDate;
            var etime = this.param.endDate;
            var params =[stime,etime];
            $.when(Public.commonajax("coms.reportFormService", "queryWorkReport", JSON.stringify(params))).done(function(data) {
                                if (data.code==200) {
                                     for (var i = 0; i < data.body.length; i++) {
                                        data.body[i].date =  Public.formatDate(data.body[i].date);
                                    }
                                    that.logs = data.body;
                                }
                            })
        },
        methods: {

            // 列表页面刷新按钮
            refresh() {
                    this.$refs.page.refresh()
                },
                getrelatemodule(item, event) {
                   


                },
            searchmethod:function(){
                var that = this;
                var stime = this.param.startDate;
                var etime = this.param.endDate;
                var params =[stime,etime];
                $.when(Public.commonajax("coms.reportFormService", "queryWorkReport", JSON.stringify(params))).done(function(data) {
                                    if (data.code==200) {
                                        for (var i = 0; i < data.body.length; i++) {
                                            data.body[i].date =  Public.formatDate(data.body[i].date);
                                        }
                                        that.logs = data.body;
                                    }
                                })
                },
            print:function(){
                $("#print").jqprint();
            }
        
        },
        events: {
            // 分页列表数据
            'data' (data) {
                this.patientsAll = data;
            },
        },
        watch: {

        }
            
}
</script>
<style scoped>
.menuset_con {
    width: 950px;
    min-height: 644px;
    height: auto!important;
    border: 1px solid #e6e6e6;
    border-radius: 10px;
    padding-top: 30px;
    background-color: #fff;
}


.products .tit {
    background: #f8f8f8;
    
}

.products .tit h2 {
    border-left: 5px solid #00c484;
    line-height: 20px;
    font-size: 16px;
    padding: 0 10px;
    height: 20px;
}

.products,
.modules {
    border: 1px solid #ccc;
    border-radius: 5px;
}

.products ul {
    padding: 20px;
}

.products li {
    background: url(../../assets/img/drop.png) no-repeat left 8px;
    padding-left: 15px;
}

.products li dl {
    margin-left: 20px;
}

.products li dd,
.products li p {
    line-height: 28px;
    height: 28px;
}

.products li dd.cur,
.products li p.cur {
    background: #ccc
}

.products li dd:hover,
.products li p:hover {
    cursor: pointer;
    color: rgb(92,192,155);
}

.modules table th {
    text-align: center;
}

.modules table td {
    
    text-align: center
}
.modules table td {
    
    vertical-align: middle;
}

.modules table td:nth-child(7) {
  width: 100px;
}

.modules table td:nth-child(6) {
    width: 100px;
}

.modules table tbody td:nth-child(1) {
    width: 100px;
}
table{
    margin-bottom: 0;
}
table img{
    border-radius: 50%
}
label{
    margin-right: 10px;
}
input{
    color: #666666;
    padding-left: 10px;
}
.search{
    margin-bottom: 10px;
}
.search button{
    display: inline-block;
}
.memberlist{
    margin-bottom: 10px;
}
.memberlist form.cbafter .fl {
    width: 850px
}

.memberlist form.cbafter label {
    font-weight: normal;
    color: #999
}

.memberlist form.cbafter input,
.memberlist form.cbafter select {
    display: inline-block;
    width: 150px;
    border: none;
    border-bottom: 1px dashed #ccc;
    box-shadow: none;
    color: #333
}
.menuset_con_right tbody tr:hover{
    background-color: rgb(92,192,155);
}
</style>
